Facebox 弹层插件

facebox是一个开源的弹出层插件，基于jQuery. 可显示图像， divs ，或者远程页面。目前存放在Github上

使用简单，文件少，例子也浅显易懂，个人比较喜欢 。

项目中用到了比较多的弹层操作，facebox还是比较适合。具体如下:

首先需要引入css,js文件 及 一个隐藏的DIV

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="facebox/facebox.js"></script>
<link rel="stylesheet" type="text/css" href="facebox/facebox.css">

<div id="dnote" style="display:none"> </div>

一个弹层的方法：

function popup(el) {
        jQuery.facebox({div:el,
            loadingImage:'facebox/loading.gif',
            closeImage:'facebox/closelabel.png'
        });
}

调用就比较简单了，在ajax中：

jQuery.ajax({
    url:"marketing,ShowNotes.vm",
    type:"POST",
    data:"messId="+id,
    success:function(response){
        jQuery("#dnotes").html(response);
        popup("#dnotes")
    },
    error:function(){
    }
});

遇到个小问题 就是关于loading及closelabel图片的路径问题，文件没存放在项目的根路径下。而上面指定的路径似乎也不好用，最后到源码facebox.js里修改为正确的路径，最终正确显示，不知道这是我使用问题还是什么原因~~

settings: {
     opacity      : 0.2,
     overlay      : true,
     loadingImage : 'facebox/loading.gif',       //此处
     closeImage   : 'facebox/closelabel.png',  //此处
     imageTypes   : [ 'png', 'jpg', 'jpeg', 'gif' ],
     faceboxHtml  : '\
   <div id="facebox" style="display:none;"> \
     <div class="popup"> \
       <div class="content"> \
       </div> \
       <a href="#" class="close"><img src="facebox/closelabel.png //此处" title="close" class="close_image" /></a> \
     </div> \
   </div>'
   },